<!DOCTYPE html>
<html lang="en">    
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <meta http-equiv="X-UA-Compatible" content="ie=edge">
        <title>乐淘云购</title>
        <link rel="stylesheet" href="assets/mui/css/mui.min.css">
        <link rel="stylesheet" href="assets/fontAwesome/css/font-awesome.min.css">
        <link rel="stylesheet" href="css/base.css">
        <link rel="stylesheet" href="css/category.css">
        <script src="assets/mui/js/mui.min.js"></script>
        <script src="assets/zepto/zepto.min.js"></script>
        <script src="js/category.js"></script>
        <script src="assets/artTemplate/template-native.js"></script>
</head>
<body>
    <!-- 首页 -->
    <header class="mui-bar mui-bar-nav my-header">
        <a href="javascript:;" class="mui-icon mui-icon-search mui-pull-right"></a>
        <h1 id="title" class="mui-title title">乐淘首页</h1>
    </header>
<div class="my-content ">
<div class="cate-list-left ">
    <div class="mui-scroll-wrapper">
        <div class="mui-scroll">
         <div class="links" id="links"></div>
               
        </div>
    </div>
</div>
    <div class="cate-list-right ">
        <div class="mui-scroll-wrapper">
            <div class="mui-scroll">
                    <div class="titleImg">
                     <!-- <a href="javascript:;"> <img src="images/brand1.png" alt=""></a>
                     <a href="javascript:;"> <img src="images/brand2.png" alt=""></a>
                     <a href="javascript:;"> <img src="images/brand3.png" alt=""></a>
                     <a href="javascript:;"> <img src="images/brand4.png" alt=""></a>
                     <a href="javascript:;"> <img src="images/brand5.png" alt=""></a>  -->
                </div>
            </div>
        </div>
    </div> 
</div>

    <!-- 尾部 -->
    <nav class="mui-bar mui-bar-tab">
        <a id="defaultTab" class="mui-tab-item mui-active" href="tab-webview-subpage-about.html">
            <span class="mui-icon mui-icon-home"></span>
            <span class="mui-tab-label">首页</span>
        </a>
        <a class="mui-tab-item" href="tab-webview-subpage-chat.html">
            <span class="mui-icon mui-icon-email">
                <span class="mui-badge">9</span>
            </span>
            <span class="mui-tab-label">消息</span>
        </a>
        <a class="mui-tab-item" href="tab-webview-subpage-contact.html">
            <span class="mui-icon mui-icon-contact"></span>
            <span class="mui-tab-label">通讯录</span>
        </a>
        <a class="mui-tab-item" href="tab-webview-subpage-setting.html">
            <span class="mui-icon mui-icon-gear"></span>
            <span class="mui-tab-label">设置</span>
        </a>
    </nav>
</body>
</html>
<script  id="scroll" type="text/template">
    <% for(var i=0; i<text.length ; i++){ %>

     <a href="javascript:;"class="active" data-id=<%=text[i].id%> > <%=text[i].categoryName %> </a>
  
    <% } %>
   <!-- 1.引入文件
   2.art模板
   3.template()
   4.渲染数据 -->
</script>

<script id="right" type="text/template">
  <% for (var i=0; i<up.length ; i++){ %>
      <a href="javascript:;">
           <img src="<%=up[i].brandLogo%>" alt=""> 
           <span> <%=up[i].brandName%> </span>
        </a>
  <%}%>
    <% if(!up.length){ %>
         <span>数据加载完毕</span>
    <%}%>
</script>

<!-- 动态生成的元素不能直接绑定事件 应该给其父元素绑定事件 委托 -->